<!-- 内推直通车 -->
<template>
	<view class="page">
		<view class="back" :style="{'top': `${tabbarTop}px`,'position': 'fixed',
			'left': '30rpx'}" @click="back">
			<u-icon name="arrow-left" color="#ffffff" size="50"></u-icon>
		</view>
		<view class="img1">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/giantcart/title.png" mode=""></image>
		</view>
		<view class="img2">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/giantcart/HJ.png" mode=""></image>
		</view>
		<view class="img3">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/giantcart/hengtiao.png" mode=""></image>
		</view>
		<view class="" style="height: 686rpx;">

		</view>
		<view class="content flex justify-center align-center flex-column">
			<view class="coo">

			</view>
			<view style="height: 47rpx;width: 100%;">
				
			</view>
			<view class="list flex flex-wrap">
				<view class="item flex justify-center align-center flex-column" v-for="item in list" :key="item.companyId" @click="delivery(item)">
					<u-image height="73" :src="item.companyAvatar" mode="heightFix"></u-image>
					<view class="text flex justify-center align-center">
						立即投递
					</view>
				</view>
			</view>
			<view v-if="show" class="more flex justify-between align-center" @click="more">
				<view class="icon">
					<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/giantcart/xia.png" mode=""></image>
				</view>
				<view class="text">
					查看更多
				</view>
			</view>
		</view>
		<view class="img4">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/giantcart/boo.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	import {
		giant
	} from '@/data/pushCart.js'
	export default {
		data() {
			return {
				giant,
				tabbarTop: 0,
				show: true,
				list:[],
				listQurey:{
					id:''
				}
			}
		},
		onLoad() {
			this.init()
			this.getlist()
		},
		methods: {
			init(){
				this._setTabbarTitleHeight()
			},
			//设置title高度
			_setTabbarTitleHeight() {
				let top = uni.getStorageSync('tabbarCapsule')
				this.tabbarTop = top.top
			},
			//投递简历
			delivery(item){
				uni.setStorageSync('pageNum',item.companyId)
				uni.navigateTo({
					url: '/pagesB/selectPosition/selectPosition' 
					// url: '/pagesB/positionDetail/positionDetail?item=' + JSON.stringify(item)
				})
				
			},
			async getlist() {
				let {data: list,code} = await this.$get('/positionList/introductionList')
				if(code == 200){
					
					if(list.length < 10){
						this.show = false
						this.list = list
					}else{
						this.show = true
						this.list = list.splice(0,9)
					}
				}
				
			},
			//查看更多
			async more(){
				this.show = false
				let {data: list,code} = await this.$get('/positionList/introductionList')
				if(code == 200){
					this.list = list
				}
			},
			//返回按钮
			back(){
				uni.navigateBack({
					delta:0
				})
			}
		}
	}
</script>

<style lang="scss">
	.page {
		width: 750rpx;
		background-image: url("https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/giantcart/bcc.png");
		background-repeat: repeat;
		background-size: 100%;
		padding-bottom: 150rpx;
		position: relative;
		min-height: 100vh;
		.back{
			width: 40rpx;
			height: 50rpx;
		}

		.img1 {
			float: left;
			margin-top: 95rpx;
			margin-left: 65rpx;
			width: 621rpx;
			height: 377rpx;
		}

		.img2 {
			position: absolute;
			top: 456rpx;
			left: 57rpx;
			width: 664rpx;
			height: 336rpx;
			z-index: 10;
		}

		.img3 {
			position: absolute;
			top: 651rpx;
			left: 2rpx;
			width: 746rpx;
			height: 91rpx;
			z-index: 8;
		}

		.img4 {
			height: 66rpx;
			margin-left: 41rpx;
			width: 667rpx;
			z-index: 8;
		}

		.content {
			position: relative;
			margin-left: 41rpx;
			width: 667rpx;
			background: #FFFFFF;
			z-index: 9;

			.coo {
				width: 100%;
				height: 80rpx;
				background-image: linear-gradient(#E3DBCB, #FFFFFF);
			}

			.list {
				display: flex;
				justify-content: space-between;
				.item {
					width: 33.33%;
					margin-bottom: 80rpx;
					.text {
						width: 164rpx;
						height: 48rpx;
						background: linear-gradient(131deg, #378CFF, #0265EB);
						border-radius: 24px;
						color: #ffffff;
						font-size: 24rpx;
						margin-top: 23rpx;
						line-height: 1;
					}
				}
			}
			.list:after {
			content: "";
			flex: auto;
			}
			.more{
				width: 132rpx;
				margin: 10rpx 0 40rpx 0;
				.icon{
					width: 20rpx;
					height: 20rpx;
					line-height: 0;
				}
				.text{
					color: #999999;
					font-size: 24rpx;
					line-height: 0;
				}
			}
		}
	}
</style>
